<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>收款人主页</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/static/admin.css" media="all">
</head>
<body>
  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <!--<div class="layui-col-md8">-->
        <!--<div class="layui-row layui-col-space15">-->
          <!--<div class="layui-col-md12">-->
            <!--<div class="layui-card">-->
              <!--<div class="layui-card-header">数据概览</div>-->
              <!--<div class="layui-card-body">-->
                <!--<div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-dataview">-->
                  <!--<div carousel-item id="LAY-index-dataview">-->
                    <!--<div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>-->
                  <!--</div>-->
                <!--</div>-->
              <!--</div>-->
            <!--</div>-->
          <!--</div>-->
        <!--</div>-->
      <!--</div>-->

      <div class="layui-col-md4">
        <div class="layui-card" style = "text-align:center;">
          <div class="layui-card-header" >账户余额 <button class="layui-btn layui-btn-radius layui-btn-normal" id="balance_todo"  style = "text-align:right;">资金</button></div>
          <div class="layui-card-header" ><h1 style="color:red">￥#(balance)</h1></div>

        </div>

        #for(card: cardList)
        <div class="layui-card" style = "text-align:center;">
          <div class="layui-card-header">我的收款卡 </div>
          <div class="layui-card-body layui-text">
            <table class="layui-table">
              <colgroup>
                <col width="100">
                <col>
              </colgroup>
              <tbody>
              <tr>
                <td>收款户名</td>
                <td>#(card.customerName)</td>
              </tr>
              <tr>
                <td>收款账号</td>
                <td>#(card.cardNo)</td>
              </tr>
              <tr>
                <td>收款银行</td>
                <td>#(card.bankName)</td>
              </tr>
              <tr>
                <td>收款商户</td>
                <td>#(merch.code)-#(merch.name)</td>
              </tr>
              <tr>
                <td>联系人</td>
                <td>#(merch.name)</td>
              </tr>
              <tr>
                <td>联系电话</td>
                <td>#(card.phoneNo)</td>
              </tr>
              <tr>
                <td>更新时间</td>
                <td>#(merch.createTime)</td>
              </tr>
              </tbody>
            </table>
          </div>
          <button class="layui-btn layui-btn-radius layui-btn-normal" onclick="createChange(#(card.id), #(merch.id))">开始制单</button>
        </div>
        #end

        <div class="layui-card">
          <div class="layui-card-header">
            <a  onclick="listChange()">等待充值的制单列表</a>
          </div>
        </div>

        <div class="layui-card">
          <div class="layui-card-header">
            <a href="#(merch.viewpdf_url)">签署完成的合同查看 </a>
          </div>
          </div>

        </div>
      </div>
    </div>
  </div>



  <script src="/static/layui/layui.js"></script>
  <script>
  layui.config({
    base: '../../' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'console'], function(){
		var $ = layui.$;
		$.ajax({
			url: layui.setter.base + 'merch/order/charts?'+Math.random(), //实际使用请改成服务端真实接口
	        type: "get",
	        dataType: "json",
	        success: function(res){
	        	var totals = new Array(),counts = new Array();
	        	for(var i=0; i<res.length; i++){
	        		totals.push(res[i].total);
	        		counts.push(res[i].count);
	        	}
	        	showChart(totals, counts);
	        }
		});
	});

  function createChange( card_id, merch_id) {
      //alert("开始制单...." + card_id + ";" + merch_id);
     window.location.href = layui.setter.base + 'merch/creatOrder?cardId=' + card_id + '&merchId=' + merch_id;
  }

  function listChange() {
      window.location.href = layui.setter.base + 'merch/order/chargeList';
  }

  function showChart(totals, counts){
	    // 图表
	    layui.use(["carousel", "echarts"],
	    function() {
	        var $ = layui.$,
	        carousel = layui.carousel,
	        echarts = layui.echarts,
	        chartProps = [{
	            title: {
	                text: "今日交易趋势",
	                x: "center",
	                textStyle: {fontSize: 14}
	            },
	            tooltip: {
	                trigger: "axis"
	            },
	            legend: {
	                data: ["", ""]
	            },
	            xAxis: [{
	                type: "category",
	                boundaryGap: !1,
	                data: ["00:00", "01:00", "02:00", "03:00", "04:00", "05:00", "06:00", "07:00", "08:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00", "15:00", "16:00", "17:00", "18:00", "19:00", "20:00", "21:00", "22:00", "23:00"]
	            }],
	            yAxis: [{
	                type: "value"
	            }],
	            series: [{
	                name: "金额",
	                type: "line",
	                smooth: !0,
	                itemStyle: {
	                    normal: {
	                        areaStyle: {
	                            type: "default"
	                        }
	                    }
	                },
	                data: totals
	            },
	            {
	                name: "笔数",
	                type: "line",
	                smooth: !0,
	                itemStyle: {
	                    normal: {
	                        areaStyle: {
	                            type: "default"
	                        }
	                    }
	                },
	                data: counts
	            }]
	        }
	        ],
	        divs = $("#LAY-index-dataview").children("div"),
	        divCharts = [],
	        initChart = function(e) {
	        	divCharts[e] = echarts.init(divs[e], layui.echartsTheme),
	        	divCharts[e].setOption(chartProps[e]),
	            window.onresize = divCharts[e].resize
	        };
	        if (divs[0]) {
	        	initChart(0);
	            var idx = 0;
	            carousel.on("change(LAY-index-dataview)",
	            function(e) {
	            	initChart(idx = e.index)
	            }),
	            layui.admin.on("side",
	            function() {
	                setTimeout(function() {
	                	initChart(idx)
	                },
	                300)
	            }),
	            layui.admin.on("hash(tab)",
	            function() {
	                layui.router().path.join("") || initChart(idx)
	            })
	        }
	    })
	}
  </script>
</body>
</html>

